// 添加和编辑 基础数据弹窗
import React, { Component } from 'react'
import { Button,Form, Input, Modal, Select,Upload ,Icon ,message,InputNumber,Checkbox } from 'antd'
import { connect } from 'react-redux'
/* 引用接口文档路径 */
import {
  addBaseData,editBaseData
} from 'actions/admin'
const FormItem = Form.Item

@Form.create({
    mapPropsToFields(props) {
      return {
        type: Form.createFormField({
          ...props.content,
          value: props.content.type,
        }),
        value: Form.createFormField({
          ...props.content,
          value: props.content.value,
        }),
        sortNum: Form.createFormField({
          ...props.content,
          value: props.content.sortNum,
        }),
        isDefault: Form.createFormField({
          ...props.content,
          value: props.content.isDefault==1 ? '1':'0',
        }),
        description: Form.createFormField({
          ...props.content,
          value: props.content.description,
        }),
        ischecked: Form.createFormField({
          ...props.content,
          value: props.content.ischecked,
        }),
        parentId: Form.createFormField({
          ...props.content,
          value: props.content.parentId,
        }),
        selecttype:Form.createFormField({
          ...props.content,
          value: props.content.selecttype
        }),
      };
    } 
})

@connect(
  (state, props) => ({
    config: state.config,
    userInfoList: state.userInfoList,
  })
)


export default class ModalAddBaseData extends Component {
  
    constructor (props) {
      super(props)
      this.state = {
        publisherList:[],
        ischecked:false//是否选中默认菜单
      }
    }


    addReportSubmit(callback,e){//新增和编辑确定按钮
        e.preventDefault();
        this.props.form.validateFields((err, values) => {
            if(!err){
                if(this.props.type == 1){
                  var datajson = {
                      "type":values.type,//类型
                      "value":values.value,//值
                      "sortNum":values.sortNum,//排序序号
                      "isDefault":values.isDefault,//是否默认
                      "description":values.description,//描述
                      "parentId":this.state.ischecked?values.parentId:'',//是否选中
                      "isThree":this.state.ischecked?1:0,//是否三级菜单
                  }
                  //新增              
                  this.props.dispatch(addBaseData(
                  datajson,
                  (respose) => {
                      callback&&callback()
                      this.props.ModalCancel();
                  }))
                }else{
                    var datajson = {
                        "id":this.props.content.id,//大咖课堂ID
                        "type":values.type,//类型
                        "value":values.value,//值
                        "sortNum":values.sortNum,//排序序号
                        "isDefault":values.isDefault,//是否默认
                        "description":values.description,//描述
                        "parentId":this.state.ischecked?values.parentId:'',//是否选中
                        "isThree":this.state.ischecked?1:0,//是否三级菜单
                    }
                    //编辑
                    this.props.dispatch(editBaseData(
                    datajson,
                    (respose) => {
                        callback&&callback()
                        this.props.ModalCancel();
                    })) 
                }                                
            }
        });       
    }
    selectFn(value){
      this.props.selectcallback(value);
    }
    abc(e){
      this.props.ischeckedFn(e.target.checked)
    }
    componentWillReceiveProps(props){//在组件接收到一个新的 prop (更新后)时被调用。这个方法在初始化render时不会被调用。
      this.setState({
        ischecked:props.content.ischecked
      })
    }
    render () {
        const { getFieldDecorator } = this.props.form;
        const content = this.props.content;
        const formItemLayout = {
          labelCol: {
            xs: { span: 24 },
            sm: { span: 4 },
          },
          wrapperCol: {
            xs: { span: 24 },
            sm: { span: 16 },
          },
        };
        return (
            <Modal
                maskClosable={false}
                visible={this.props.ModalFlg}
                title={this.props.type == '1' ? "新增基础数据" : "编辑基础数据" }
                onCancel={this.props.ModalCancel}
                onOk={this.addReportSubmit.bind(this,this.props.callback)}
                destroyOnClose={true}
            >
            <div>
              <Form>
                <FormItem label="类型" {...formItemLayout}>
                  {
                    getFieldDecorator('type', {
                    rules: [{
                        required: true,message:"请选择数据类型"
                      }],
                    })(
                      <Select placeholder="请选择数据类型"  onChange={this.selectFn.bind(this)}  style={{ width: 150 }} >
                        {
                          this.props.selectTypeList.map((item,i)=> {
                            return(
                              <Select.Option value={item.code} key={i} >{item.value}</Select.Option>
                            )
                          })
                        }
                      </Select> 
                    )
                  }
                </FormItem>
                <FormItem label="三级数据" {...formItemLayout}>
                  {
                    getFieldDecorator('ischecked', {
                    rules: [{
                        required: false,message:"是否三级菜单"
                      }],
                    })(
                      <Checkbox defaultChecked={this.state.ischecked} onChange={this.abc.bind(this)}></Checkbox>
                    )
                  }
                </FormItem>
                
                {this.state.ischecked?<FormItem label="三级数据" {...formItemLayout}>
                {
                  getFieldDecorator('parentId', {
                    })(
                    <Select placeholder="请选择数据类型"    style={{ width: 150 }} >
                      {
                          this.props.threedateType.map((item,i)=> {
                          return(
                            <Select.Option value={item.code} key={i}>{item.value}</Select.Option>
                          )
                        })
                      }
                    </Select> 
                  )
                }
              </FormItem>:""}
                
                <FormItem label="值" {...formItemLayout}>
                  {
                    getFieldDecorator('value', {
                    rules: [{
                        required: true,message:"请输入值"
                      }],
                    })(
                      <Input placeholder="请输入关键字"   size="default" style={{ width: '200px' }} />
                    )
                  }             
                </FormItem>
                <FormItem label="排序序号" {...formItemLayout}>
                  {
                    getFieldDecorator('sortNum', {
                    rules: [{
                        required: true,message:"请输入排序序号"
                      }],
                    })(
                      <InputNumber placeholder="请输入排序序号" size="default" style={{ width: '200px' }} />
                    )
                  }  
                </FormItem>
                <FormItem label="是否默认" {...formItemLayout}>
                  {
                    getFieldDecorator('isDefault', {
                    rules: [{
                        required: false,
                      }],
                    })(
                      <Select placeholder="请选择发布人"    style={{ width: 120 }} >                      
                        <Select.Option value="1" key="1">是</Select.Option>
                        <Select.Option value="0" key="0">否</Select.Option>                     
                      </Select> 
                    )
                  }  
                </FormItem>
                <FormItem label="描述" {...formItemLayout}>
                  {/* 富文本 */}
                  {
                    getFieldDecorator('description', {
                    rules: [{
                        required: false,
                      }],
                    })(
                      <Input placeholder="请输入关键字" size="default" style={{ width: '200px' }} />                   
                    )
                  }
                </FormItem>
              </Form>
            </div>
          </Modal>
        )
    }
}
